//封装一个请求工具
//1.创建一个新的axios实例
//2.请求的拦截器，如果有token进行头部携带
//3.响应拦截器，1.剥离无效数据，获取有效数据 2.判断token，处理token失效情况
//4.导出一个函数，调用当前的axios实例发请求，返回值promise
import store from '@/store'
import axios from 'axios'
import router from '@/router'


//1.创建一个新的axios实例
// 导出基准地址，原因：其他地方(例如：图片上传)不是通过axios发请求的地方用上基准地址
export const baseURL = 'http://pcapi-xiaotuxian-front-devtest.itheima.net/'
const instance = axios.create({
    //设置基准路径
    //配置请求的基准url地址
    baseURL,
    //过期时间
    timeout: 5000
})


//2.请求的拦截器，如果有token进行头部携带
instance.interceptors.request.use(config => {
    //响应正确的时候
    //拦截业务逻辑
    //进行请求配置修改
    //如果本地有token，就在请求中携带token
    //1.获取用户信息对象
    const { profile } = store.state.user
        //2.判断token是否存在
    if (profile.token) {
        // 3. 设置token
        config.headers.Authorization = `Bearer ${profile.token}`
    }
    return config

}), err => {
    // 对响应错误做点什么
    return Promise.reject(err);
}


//3.响应拦截器，1.剥离无效数据，获取有效数据 2.判断token，处理token失效情况
instance.interceptors.response.use(res => res.data, err => {
    // 401 状态码，进入该函数
    if (err.response && err.response.status === 401) {
        // 1. 清空无效用户信息
        store.commit('user/setUser', {});
        // 2. 跳转到登录页
        router.push('/login')
            // 3. 跳转需要传参（当前路由地址）给登录页码
            //当前路径
            // 组件里头：`/user?a=10` $route.path === /user  $route.fullPath === /user?a=10
            // js模块中：router.currentRoute.value.fullPath 就是当前路由地址，router.currentRoute 是ref响应式数据
        const fullPath = encodeURIComponent(router.currentRoute.value.fullPath)
            // encodeURIComponent 转换uri编码，防止解析地址出问题
        router.push('/login?redirectUrl=' + fullPath)
    }
    return Promise.reject(err)
})


//请求工具函数
export default (url, method, submitData) => {
    //负责发请求，请求地址，请求方式，提交的数据
    return instance({
        url,
        method,
        //1.如果是get请求，要使用params来传递
        //2.如果不是get请求，要使用data来传递
        //[] 设置一个动态key，写js表达式，js表达式执行结果当作key
        [method.toLowerCase() === 'get' ? 'params' : 'data']: submitData
    })
}